
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:rfid/page/help_detail_page.dart';
import '../main.dart';
import '../util/timer_manager.dart';
import '../widget/device_name_widget.dart';


class Help extends StatefulWidget {
  const Help({Key? key}) : super(key: key);

  @override
  State<Help> createState() => _HelpState();
}

class _HelpState extends State<Help> {


  @override
  initState() {
    super.initState();

    WidgetsBinding.instance.addPostFrameCallback((_){
      timer.startCountDown(CountDownMode.normal,(){
        Get.until((route) => route.isFirst);
      });
    });

  }


  _appBar(){
    return Container(
      width: double.infinity,
      height: 42.h,
      alignment: Alignment.center,
      padding: const EdgeInsets.only(left: 20,right: 20).w,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          deviceNameWidget(),
          Row(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Text("",style: TextStyle(color: Colors.white,fontSize: 12.sp),)
            ],
          )

        ],
      ),
    );
  }



  _title(){
    return Container(
        margin: EdgeInsets.only(top: 20.h,left: 20.w,right: 20.w),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            InkWell(
              onTap: (){
                timer.cancel();
                Get.back();
              },
              child: Image.asset("assets/images/back.png",width:60.w,height:23.h, fit: BoxFit.fill,),
            ),

            Obx(() => Text("${timer.normalTime.value}s",style: TextStyle(color: Colors.white,fontSize: 12.sp),))
          ],
        )
    );
  }


  _image(name){
    return InkWell(
      onTap:(){
          Get.to(()=>const HelpDetail(),arguments: name);
      },
      child: Image.asset("assets/images/$name.png",height: 91.h, width: 330.w, fit: BoxFit.fill,),
    );
  }



  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: double.infinity,
        height: double.infinity,
        decoration: const BoxDecoration(
          image: DecorationImage(
            fit: BoxFit.fill,
            image: AssetImage(
              "assets/images/bg.png",
            ),
          ),
        ),
        child: Column(
          children: [
            _appBar(),
            _title(),
            SizedBox(height: 60.h,),
            _image( "step1"),
            SizedBox(height: 10.h,),
            _image( "step2"),
            SizedBox(height: 10.h,),
            _image( "step3"),
            SizedBox(height: 10.h,),
            _image( "step4"),
          ],
        ),
      ),
    );
  }
}

